import { useEffect } from 'react';
import { useNavigate } from 'react-router-dom'

import http from '../../utils/http';

import { Button, Radio, Form, Input,message } from 'antd';

import './index.scss';

const Login = () => {
    // 接口测试
    // useEffect(()=>{
    //     http({
    //         url:'/login/getuser',
    //         params:{
    //             username:'201',
    //             password:'201',
    //             type:'管理员'
    //         }
    //     }).then((res)=>{
    //         console.log(res);
    //     })
    // })

    const navigate = useNavigate();

    const onFinish = (values) => {
        console.log('Success:', values);

        http({
            url:"/login/getuser",
            params:values
        }).then((res)=>{
            if(res.code==200){
                message.success('登录成功！');
                navigate('/home');
            }
        })

        
    };

    return <div className='login'>
        <Form
            name="basic"
            labelCol={{
                span: 6,
            }}
            wrapperCol={{
                span: 16,
            }}
            initialValues={{
                type: '学生',
            }}
            onFinish={onFinish}
            autoComplete="off"
        >
            <Form.Item
                label="账户"
                name="username"
                rules={[
                    {
                        required: true,
                        message: '请求输入账号',
                    },
                ]}
            >
                <Input />
            </Form.Item>

            <Form.Item
                label="密码"
                name="password"
                rules={[
                    {
                        required: true,
                        message: '请输入密码',
                    },
                ]}
            >
                <Input.Password />
            </Form.Item>

            <Form.Item name="type" label="权限">
                <Radio.Group >
                    <Radio value="学生">学生</Radio>
                    <Radio value="管理员">管理员</Radio>
                </Radio.Group>
            </Form.Item>

            <Form.Item
                wrapperCol={{
                    offset: 11,
                    span: 16,
                }}
            >
                <Button type="primary" htmlType="submit">
                    登录
                </Button>
            </Form.Item>
        </Form>
    </div>
}

export default Login;